<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <head th:replace="common/head"/>
</head>
<body>
<div class="x-body">
    <form class="layui-form" style="padding-bottom: 10px;text-align: left;">
        <div class="layui-form-item">
            时间类型：
            <div class="layui-inline">
                <select name="timeType" lay-search="" lay-filter="timeTypeSelect">
                    <option value=1 selected>按月查询</option>
                    <option value=2 >按年查询</option>
                    <option value=3 >总计</option>
                </select>
            </div>
            客户：
            <div class="layui-inline">
                <select name="userId" lay-search="">
                    <option value="">直接选择或搜索选择</option>
                    <th:block th:each="map: ${userList}">
                        <option th:value="${map.userId}" th:text="${map.userName}"></option>
                    </th:block>
                </select>
            </div>
            <div class="layui-inline" id="monthDateType">
                开始时间：
                <div class="layui-inline">
                    <div class="layui-input-inline">
                        <input type="text" name="monthBeginDate" lay-verify="myCheckDate" placeholder="yyyyMM" autocomplete="off" class="layui-input layStatisticsMonth">
                    </div>
                </div>
                结束时间：
                <div class="layui-inline">
                    <div class="layui-input-inline">
                        <input type="text" name="monthEndDate" lay-verify="myCheckDate" placeholder="yyyyMM" autocomplete="off" class="layui-input layStatisticsMonth">
                    </div>
                </div>
            </div>
            <div class="layui-inline" id="yearDateType" style="display:none">
                开始时间：
                <div class="layui-inline">
                    <div class="layui-input-inline">
                        <input type="text" name="yearBeginDate" lay-verify="myCheckDate" placeholder="yyyy" autocomplete="off" class="layui-input layStatisticsYear">
                    </div>
                </div>
                结束时间：
                <div class="layui-inline">
                    <div class="layui-input-inline">
                        <input type="text" name="yearEndDate" lay-verify="myCheckDate" placeholder="yyyy" autocomplete="off" class="layui-input layStatisticsYear">
                    </div>
                </div>
            </div>
        </div>
        <button class="layui-btn layui-btn-normal" lay-submit lay-filter="search"><i class="layui-icon">&#xe615;</i></button>
        <button class="layui-btn layui-btn-normal" lay-submit refreshUrl="/statistics/refresh?type=2" lay-filter="refresh"><i class="layui-icon">&#xe666;</i></button>
    </form>

    <table class="layui-table"
           lay-data="{url:'/statisticsUserOrder/list', page:true,id:'table',limit:15,limits:[10,15,20,50,100]}"
           lay-filter="table">
        <thead>
        <tr>
            <th lay-data="{field:'userId',align:'center', sort: true,templet:'#userList'}">客户</th>
            <th lay-data="{field:'userOrderTime',align:'center'}">时间段</th>
            <th lay-data="{field:'totalCost',align:'center', sort: true}">总消费</th>
            <th lay-data="{field:'totalOriginal',align:'center', sort: true}">总成本</th>
            <th lay-data="{field:'totalGain',align:'center', sort: true}">总利润</th>
            <th lay-data="{field:'updateTime',align:'center', sort: false}">更新时间</th>
        </tr>
        </thead>
    </table>

    <script type="text/html" id="userList" th:inline="javascript">
        {{#  var list = [[${userList}]] }}
        {{#  for(var index in list){ }}
        {{#     if(d.userId == list[index].userId){ }}
        {{         unescape(list[index].userName.replace(/\\u/g, '%u')) }}
        {{#     } }}
        {{#  } }}
    </script>

</div>
<div th:replace="common/js"></div>
<div th:replace="common/setting"></div>
<script type="text/javascript">
    layui.use('xstatistics');
    layui.use('xtable');
</script>
</body>
</html>
